<template>
  <div>
    <input v-model="searchText" @change="inputchange" placeholder="请输入"/>
    <button @click="resevers">清空</button>
    <button @click="addList">提交</button>
    <button @click="$emit('removeAll')">数据重置</button>
  </div>
</template>
<script>
import { ref } from '@vue/reactivity'
export default {
  props:{
    // searchText: String
  },
  emits: ['resevers','addList','exchangeInput'],
  setup(props,context){
    const searchText = ref("")
    // searchText.value = props.searchText

    // 移开input修改searchText值
    function inputchange(value){
      console.log(value.target.value)
      // 修改父组件值
      context.emit('exchangeInput',value.target.value)
    }

    const resevers = () => {
      searchText.value=""
      context.emit('resevers')
    }
    const addList = () => {
      if(searchText.value!=""){
        context.emit('addList',searchText.value)
        searchText.value=""
      }
    }
    return{
      searchText,resevers,addList,inputchange
    }
  }
}
</script>